<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
	<head>
		<title>账户流水</title>
		<%@include file="/WEB-INF/base.jspf"%>
		<style type="text/css">
			*{font-size: 14px;}
			li{height: 60px;line-height: 60px;border-top: 1px solid #f2f2f2;}
			.green,.red{border-radius:10px; border:1px solid silver ;box-shadow: 2px 3px 1px silver;padding:10px;padding-left:30px; ;line-height:30px;margin-bottom: 20px;text-align: left;}
			.green{border-top:5px solid green;}
			.red{border-top:5px solid red;}
			.span-c-pointMoney {
				color: red;
				font-weight: bold;
			}
			.span-c-greenText, .span-c-redText, .span-c-typeWrapper {
				font-weight:bold;
			}
			.span-c-redText {
				color:red;
			}
			.span-c-typeWrapper {
				color: #059BF3;
			}
			
			.span-c-greenText {
				color:green;
			}
		</style>
	</head>

	<body style="background: #f2f2f2;">
		<div class="col-xs-12 col-sm-4 col-sm-offset-4 text-center" style="height: 50px;line-height:50px;position: fixed;margin-top: 0px;left: 0px;z-index: 100;background-color:#059BF3;color:white;">
			<a onclick="back()" class="glyphicon glyphicon-chevron-left" style="cursor:pointer;color: white;font-size: 20px;position: absolute;top:50%;left:10px;transform:translateY(-50%);"></a>
			<strong style="font-size: 20px;">账户流水</strong>
		</div>
		<div id="div-i-liushuiList" class="col-xs-12 col-sm-4 col-sm-offset-4 text-center" style="background: white;">
			<div style="height: 70px;"></div>
			<c:forEach  items="${liushui }" var="ls" varStatus="ind">
				<c:if test="${ls.state}">
					<div class="green">
				</c:if>
				<c:if test="${!ls.state}">
					<div class="red">
				</c:if>
					<c:if test="${ls.period!=null && ls.period!='-'}">
					　　期号：${ls.period}<br>
					</c:if>
					流水类型：<c:if test="${ls.cname!='-'}">${ls.cname }</c:if>
					<span class="span-c-typeWrapper">${ls.bdtype }</span><br>
					<c:if test="${ls.state}"><span class="span-c-greenText">收入金额：</span></c:if>
					<c:if test="${!ls.state}"><span class="span-c-redText">支出金额：</span></c:if>
					<span class="span-c-pointMoney">${ls.bdjine }</span> 元<br>
					　　日期：${ls.createtime }<br>
					　　余额：<span class="span-c-pointMoney">${ls.bdhjine }</span> 元
				</div>
			</c:forEach>
			<%-- <button class="1">第一页</button>
			<button class="2">第二页</button>
			${liushui.size() }
			<table>
			<tr>
				<th></th>
			</tr>
			<c:forEach items="${liushui }" var="ls" varStatus="ind">
				<c:if test="${ls.type}">
					<tr style="background: green">
				</c:if>
				<c:if test="${!ls.type}">
					<tr style="background: red">
				</c:if>
						<td>${ind.index+1 }</td>
						<td>${ls.jine }</td>
						<td>${ls.beizhu }</td>
						<td>${ls.createtime }</td>
					</tr>
			</c:forEach>
			</table>
			${liushui } --%>
		</div>
	<div class="modal-div-fakeModal" id="div-i-noticeGenDan">
		<div class="div-c-modalContent">
			<h3 class="fakemodal-title"></h3>
			<div class="fakemodal-content"></div>
			<div class="fakemodal-btnsGroup"><button class="btn btn-default btn-class-closeFakeModal">关闭</button></div>
		</div>
	</div>			
		<script type="text/javascript">
		if ($("#div-i-liushuiList").find("div").length == 1) {
			showNoResultNoticeModal("#div-i-noticeGenDan", "提示", "目前您还没有收益记录", "点击前往，立刻下注！", getXiaZhuUrl())
		}		
			/* $("button").click(function(){
				if($(this).attr("class")=="1"){
					d1y();
				}else{
					d2y()
				}
			})
			function d1y(){
				<c:forEach  items="${liushui }" begin="0" end="2" var="ls" varStatus="ind">
					console.log("${ls.createtime }")
				</c:forEach>
			}
			function d2y(){
				<c:forEach  items="${liushui }" begin="3" end="10" var="ls" varStatus="ind">
					console.log("${ls.createtime }")
				</c:forEach>
			} */
			
		</script>
	</body>
</html>